<!DOCTYPE html>
<html>
<head>
  <meta charset='UTF-8'>
  <title>Matchday Example / football.db JSON(P) API</title>
  
  <script src='js/libs/jquery-2.0.2.min.js'></script>
  <script src='js/libs/underscore-1.4.4.min.js'></script>
  <script src='js/libs/require-2.1.6.js'></script>
  
  <style>
    
    .football-widget a
    {
      color: black;
      text-decoration: none;
    }

    .football-widget {
       border: 1px solid green;
       padding: 4px;
       margin: 10px;
    }
    
    .football-widget .rounds {
      margin-bottom: 10px;
    }
    
  </style>

  <script>
    require.config( {
      paths: {
        'text': 'libs/require-text-2.0.7'   // require.js text plugin
      },
      baseUrl: 'js'
    });

    require( ['football/widget', 'football/widget-today'],
                function( Widget, WidgetToday ) {

      $(document).ready( function() {

        Widget.create( '#euro', { event: 'euro.2012' } );
        Widget.create( '#at',   { event: 'at.2013_14' } );
        
        // option 2) show today's round or the last or the next
        Widget.create( '#de',   { event: 'de.2013_14', showRounds: false } );
        
        // option 3) widget with no event => show scheduled rounds for today (for all events)
        WidgetToday.create( '#rounds' );
      });

    }); // fn require
  </script>
  
  
</head>
<body>


<h1>Matchday Example / football.db JSON(P) API</h1>

<div id='euro'></div>

<!-- try another widget -->

<div id='at'></div>

<!-- try another widget -->

<div id='de'></div>

<!-- try another widget -->

<p>Any rounds scheduled today?</p>
<div id='rounds'></div>

</body>
</html>